<template>
  <div id="app" class="app">
    <div>
      <vue-particles
        color="#dedede"
        :particleOpacity="0.7"
        :particlesNumber="80"
        shapeType="circle"
        :particleSize="4"
        linesColor="#dedede"
        :linesWidth="1"
        :lineLinked="true"
        :lineOpacity="0.4"
        :linesDistance="150"
        :moveSpeed="3"
        :hoverEffect="true"
        hoverMode="grab"
        :clickEffect="true"
        clickMode="push"
      >
      </vue-particles>
      <Header></Header>
      <el-container style="margin: 10px auto;height: 1000px;">
        <Aside></Aside>
        <Main></Main>
      </el-container>
    </div>
  </div>
</template>
<script>
  import Header from '@/components/header.vue'
  import Aside from '@/components/aside.vue'
  import Main from '@/components/main.vue'
  export default {
    name: 'app',
    components: {
      Header, Aside, Main
    },
    data () {
      return {
        input: '',
        publicPath: process.env.BASE_URL,
        total: 250
      }
    },
    mounted () {

    },
    watch: {

    },

    methods: {
    }
  }
</script>
<style scoped>
  #particles-js {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
</style>
